<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
  <title>医院诊疗系统</title>
  <link rel="stylesheet" href="../css/layui.css">
  <script src="../js/jquery-3.5.1.js"></script>
  <script src="../layui.js"></script>


</head>
<body>
  <div class="layui-layout layui-layout-admin">
    <!-- 头部区域（可配合layui 已有的水平导航） -->
    <div class="layui-header">
      <div class="layui-logo layui-hide-xs layui-bg-black">医院诊疗系统</div>
      
      <ul class="layui-nav layui-layout-left">
        <!-- 移动端显示 -->
        <li class="layui-nav-item layui-show-xs-inline-block layui-hide-sm" lay-header-event="menuLeft">
          <i class="layui-icon layui-icon-spread-left"></i>
        </li>
        <li class="layui-nav-item layui-hide-xs layui-this"><a href="doctor_pending.html">预约挂号</a></li>
      
      </ul>

      <!-- 右上角导航栏 -->
      <ul class="layui-nav layui-layout-right">
          
        
        <li class="layui-nav-item layui-hide layui-show-md-inline-block">
          <a href="javascript:;">
            <img src="../image/gly.jpg" class="layui-nav-img">
            梁家铭
          </a>
          <dl class="layui-nav-child">
            <dd><a href="">修改密码</a></dd>
            <dd><a id="edit">编辑信息</a></dd>
            <dd><a href="">退出登录</a></dd>
          </dl>
        </li>
        
      </ul>
      <!-- 右上角导航栏 -->
      
    </div>
    <!-- 左侧导航区域（可配合layui已有的垂直导航） -->
    <div class="layui-side layui-bg-black">
      <div class="layui-side-scroll">
      
        <ul class="layui-nav layui-nav-tree" lay-filter="test">

          <li class="layui-nav-item layui-this">
            <a href="select_doctor.html">预约挂号</a>
          </li>

          
        </ul>
      </div>
    </div>
    
    <!-- 内容主体区域 -->
    <div class="layui-body">
        <div style="padding: 15px;">

            <!-- 面包屑 -->
   
         <div style=" padding: 15px;  background-color: #ffffff; border: solid #eeeeee 1px; box-shadow: inset 0 0 10px rgba(255, 255, 227, 0.925);">
           <fieldset class="layui-elem-field layui-field-title" style="margin: 0; border-top: none; padding: 0;height: 25px;line-height: 25px;">
             <span class="layui-breadcrumb" >
                 <a href="/">预约挂号</a>
                 <a><cite>预约挂号</cite></a>
             </span>
           </fieldset>
         </div>
         
         <!-- 面包屑 -->
   
           <blockquote class="layui-elem-quote" style="margin-top: 10px;">
             医生列表
           </blockquote>
   
   
   
           <table class="layui-hide" id="test" lay-filter="test"></table>
   
   
   
         </div>



    </div>
    <!-- 内容主体 end-->
    
  </div>


  



<!-- // 表格处理 -->

<script type="text/html" id="toolbarDemo">
    <div class="layui-btn-container">
      <input class=" layui-btn-sm" type="text"  name="" id="" placeholder="医生" >
      <a class="layui-btn layui-btn-sm" style="margin:0 0 9.6px 1em ;" >搜索</a>
    </div>
  </script>
   
  <script type="text/html" id="barDemo">
    <a class="layui-btn cancel  layui-btn-xs" lay-event="edit">预约</a>
  </script>
                
            
   
  <script>
    var a;
    var table_data = []
  layui.use('table', function(){
    var table = layui.table;
    var laydate = layui.laydate;

    $.ajax({
      url: "/user/getAllDoctor",
      type: "get",
      contentType: 'application/json;charset=UTF-8',
      // data: JSON.stringify(data.field),
      // dataType: "json",
      success: function (data) {
        console.log(data)

        for (var i = 0; i < data.length; i++) {
          let sex = '男'
          if (data[i]['ys_sex'] === 0) {
            sex = '女'
          }
          let temp_data = {
            "administrative": data[i]['ys_office'],
            "id": data[i]['ys_id'],
            "username": data[i]['ys_name'],
            "sex": sex,
            "age": data[i]['ys_age'],
            "appoint_day": "2021-10-10"
          }

          table_data.push(temp_data)

        }
        console.log(table_data)
        table.reload("test", {
          where: {
            data: table_data
          }
        })

      }
    })
    
    table.render({
      elem: '#test'
      // ,url:'mods/table/user/a.json'   //数据来源接口
      
      ,toolbar: '#toolbarDemo' //开启头部工具栏，并为其绑定左侧模板
      ,defaultToolbar: ['filter', 'exports', 'print', { //自定义头部工具栏右侧图标。如无需自定义，去除该参数即可
        title: '提示'
        ,layEvent: 'LAYTABLE_TIPS'
        ,icon: 'layui-icon-tips'
      }]
      ,title: '用户数据表'
      ,cols: [
        [  //表头
      {type: 'checkbox', fixed: 'left'}
        ,{field: 'administrative', title: '科室',fixed: 'left', width:140,sort: true,align:'center'}
        ,{field: 'id', title: '工号', width:130, sort: true, align:'center'}
        ,{field: 'username', title: '姓名', width:100,align:'center'}
        ,{field: 'sex', title: '性别', width:100,align:'center'}
        ,{field: 'age', title: '年龄', width:100,align:'center'}
        ,{field: 'appoint_day', title: '预约日期', width: 160,  align:'center',edit:'text',event:'time'
       
        }
        ,{fixed:'right', width: 150, align:'center', toolbar: '#barDemo'}
      ]
    ]
      ,page: true
      ,data: table_data
      // ,data:[
      //     {
      //         "administrative": "心血管内科",
      //         "id": 44092310,
      //         "username": "吴杰",
      //         "sex": "男",
      //         "age":40,
      //         "appoint_day": "2021-10-10",
      //     },
      // ]
    
    });


//监听行工具事件
table.on('tool(test)', function(obj){
    var data = obj.data;
    if(obj.event === 'time'){
        var field = $(this).data('appoint_day');  //获取当前对象的字段名称，（如：field:'velappr'）
        laydate.render({
            elem: this.firstChild
            ,show: true 　
            ,closeStop: this 
            , done: function (value, res) {
               
                data['appoint_day'] = value;
                obj.update(data);
// 　　　　    
   }
});
    } else if(obj.event === 'edit'){
      let ys_id = obj.data['id']
      let appoint_day = obj.data['appoint_day']
      $.ajax({
        url: "/register/insert?ys_id=" + ys_id + "&appoint_day=" + appoint_day,
        type: "get",
        contentType: 'application/text;charset=UTF-8',
        success: function (data) {
          console.log(data)

        }
      })

      alert('预约')
    }
  });


    
     
  });





  </script>
  
  
  <!-- // 表格处理 -->
  
    <!-- 修改信息事件 -->
<script>
  $("#edit").on('click',function(e){
    //打开窗口
    layer.open({
            type: 2,
            area: ['1000px', '600px'],
            fixed: false, //不固定
            maxmin: true,
            title:"个人信息",
            content: '../edit_information.html'
            // 3.父传子值
            //  success:function(layero, index){
            //       //关键在这，调用子的iframe的方法，进行传参,前两行固定写法
            //       var body = layer.getChildFrame('body', index);
            //       var iframeWin = window[layero.find('iframe')[0]['name']];
            //       var div=$(obj).text();
            //       iframeWin.childIframe(div);    //看这
            //   }
      });
  });

</script>
<!-- 修改信息事件 -->

</body>
</html>